import React, { Component } from 'react'
import Header from './插槽实现方案1-props.children/Header'
import Header2 from './插槽实现方案2-props/Header2'
class App extends Component {
  render() {
    return (
      <div>
        {/* 插槽实现方案1. 子组件通过 props.children 接收 */}
        <Header> 
          <input type="checkbox" />
          <h2>center 标题</h2>
          <i>我是斜体</i>
        </Header>

        {/* 插槽实现方案2. 子组件通过 props接收一个 React元素 */}
        <Header2
          leftSlot={<input type="checkbox" />}
          centerSlot={<h2>props的React元素</h2>}
          rightSlot={<i>React元素</i>}
        />
      </div>
    )
  }
}

export default App